@import '../../theme/mixins/mixins.scss';
@import '../../theme/default.scss';

@include b(row) {
  @extend %clearfix;
  position: relative;
  display: block;
  box-sizing: border-box;
}

@include b('row-flex') {
  display: flex;
  flex-flow: row wrap;
  &::before,
  &::after {
    display: flex;
  }
}

/* justify */
@include b('row-flex-start') {
  justify-content: flex-start;
}

@include b('row-flex-center') {
  justify-content: center;
}

@include b('row-flex-end') {
  justify-content: flex-end;
}

@include b('row-flex-space-between') {
  justify-content: space-between;
}

@include b('row-flex-space-around') {
  justify-content: space-around;
}

/* align */
@include b('row-flex-top') {
  align-items: flex-start;
}

@include b('row-flex-middle') {
  align-items: center;
}

@include b('row-flex-bottom') {
  align-items: flex-end;
}
